// 管理收货地址页面

$(function() {

    // 页面已加载，首先应该请求数据，渲染页面
    $.ajax({
        type: 'get',
        url: '/address/queryAddress',
        success: function(res) {
            console.log(res);
            var html = template('tem-address', { data: res });
            $('#addressBox').html(html);
        }
    });


    // 删除操作

    // 1、点击删除按钮，跳出提示框，提示用户是否删除
    $('#addressBox').on('tap', '#delete-btn', function() {
        // 点击时获取删除的该数据的li标签的data-id
        var id = $(this).parents('li').attr('data-id');
        // bug:MUI是原生开发的框架，取消滑动的参数不能是jQ对象
        var currentli = this.parentNode.parentNode;
        // 2、初始化提示框
        mui.confirm('确定删除该收货地址？？？', function(mas) {
            console.log(mas); //mas是个对象{index: 1, value: ""}
            // 3、当点击确定时，mas的index==1，当点击取消的时候index==0
            if (mas.index == 1) {
                //  4、当点击确定时，即删除，发送请求删除该地址
                // 删除之后：① location.reload() 刷新整个页面
                //          ② 调用渲染页面的ajax，局部刷新页面
                //          ③ 将该li.remove()   
                $.ajax({
                    type: 'post',
                    url: '/address/deleteAddress',
                    data: {
                        id: id, //点击时获取li的data-id
                    },
                    success: function(res) {
                        console.log(res);
                        if (res.success) {
                            currentli.remove();
                        }
                    }
                });
            } else {
                // 当点击取消时，让li右滑回原位，关闭滑出效果,参数为原生对象li
                // bug:MUI是原生开发的框架，取消滑动的参数不能是jQ对象
                // 可以在mui案例中右键查看框架源代码，查看ja代码
                mui.swipeoutClose(currentli);
            }
        })
    });


    // 编辑操作

    // 1、点击编辑按钮，跳转到编辑地址页面，url带过去id，根据id请求服务器数据，渲染到页面中
    // 2、修改之后，点击确定，ajax请求修改数据库，然后跳转到地址列表页面
    $('#addressBox').on('tap', '#edit-btn', function() {
        var id = $(this).parents('li').attr('data-id');
        location.href = 'edit-address.html?id=' + id;
    });
});